<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			
			function jisuan(val){
				var a = document.f.a;
				var b = document.f.b;
				var c = document.f.c;
				try{
					switch (val){
					case "重置":
						a.value="";
						b.value="";
						c.value="";
						break;
					default:
						c.value = eval(a.value+val+b.value);
						break;
					}
				}catch(e){
					//TODO handle the exception
					alert("滚蛋！！！！！！！");
				}
			}
		</script>
		<style type="text/css">
			.dd2 input[type="button"]{
				width: 40px;
				height: 40px;
				font-size: 25px;
				border-radius: 5px;
			}
			table{
				text-align: center;
				background-color: #00FFFF;
				border-radius: 10px;
			}
			table td{
				width: 140px;
				height: 50px;
			}
			table tr td input[type="text"]{
				width: 100px;
				height: 25px;
				font-size: 15px;
				border-radius: 5px;
			}
			table tr:last-of-type input{
				width: 80px;
				height: 30px;
				font-size: 15px;
				border-radius: 5px;
			}
			.dd2{
				display: flex;
				justify-content: space-around;
			}
		</style>
	</head>
	<body>
		<form action="" method="post" name="f">
			<table cellspacing="0" align="center">
				<tr>
					<td>输入第一个数:</td>
					<td><input type="text" id="a" value="" /></td>
				</tr>
				<tr>
					<td>输入第二个数:</td>
					<td><input type="text" id="b" value="" /></td>
				</tr>
				<tr>
					<td colspan="2">
						<div class="dd2">
							<input type="button" name="" id="" value="+" onclick="jisuan(this.value)" />
							<input type="button" name="" id="" value="-" onclick="jisuan(this.value)" />
							<input type="button" name="" id="" value="*" onclick="jisuan(this.value)" />
							<input type="button" name="" id="" value="/" onclick="jisuan(this.value)" />
						</div>
					</td>
				</tr>
				<tr>
					<td>结&nbsp;&nbsp;&nbsp;&nbsp;果:</td>
					<td><input type="text" id="c" value="" /></td>
				</tr>
				<tr>
					<td colspan="2"><input type="button" name="" id="" value="重置" onclick="jisuan(this.value)" /></td>
				</tr>
			</table>
		</form>
	</body>
</html>
